<template>
  <div class="demo9">
    <div class="page">
      <div class="prev">
<!--        <img src="@/view/demo/img/3.png" class="active">-->
<!--        <img src="@/view/demo/img/4.png" class="normal">-->
      </div>
      <div class="next">
<!--        <img src="@/view/demo/img/2.png" class="normal">-->
<!--        <img src="@/view/demo/img/1.png" class="active">-->
      </div>


    </div>
  </div>

</template>

<script>
  export default {
    name: 'demo9',
    components: {},
    props: {},
    data() {
      return {};
    },
    mounted() {
    },
    methods: {},
    computed: {}
  };
</script>

<style scoped lang="less">
  .page {
    .prev, .next {
      display: inline-block;

      .active {
        display: none;
      }

      &:hover {
        .active {
          display: block;
        }

        .normal {
          display: none;
        }
      }
    }
  }
</style>
<style lang="less">
  .demo9 {
  }
</style>
